<template>
	<div class="groups_message_list animated fadeInLeft">
		<div class="groups_message_list_item" v-for="(item, index) in feeds" v-if="feeds && feeds.length>0 && index<20">
			<h1>{{item.message}}</h1>
			<p>{{item.time}}</p>
			<a href="javascript:;" @click="moreClickHandle" v-if="item.aside.newsid" :id="item.aside.newsid" :type="item.aside.type" :pubdate="item.aside.pubDate">查看详情</a>
		</div>
		<div class="groups_message_list_item nodata" v-if="feeds && feeds.length===0">
			暂无动态，<a href="javascript:;" @click="goHomeClickHandle">返回首页</a>看您喜欢的新闻。
		</div>
	</div>
</template>
<script>
	export default{
		name:"groups_message_list",
		data:function(){
			return {}
		},
		props:["feeds"],
		methods:{
			moreClickHandle(e){
				let id = $(e.target).attr("id"),
					pubDate = $(e.target).attr("pubdate"),
					type = $(e.target).attr("type");
				this.$router.push("/view/"+type+"/"+window.dateFormat(new Date(pubDate).getTime())+"/"+id)
			},
			goHomeClickHandle(){
				this.$router.push('/')
			}
		}
	}
</script>
<style lang="less">
	@base:23.44/1rem;
	.groups_message_list{
		.groups_message_list_item{
			background-color: #fff;
			font-size: 20/@base;
			padding:10/@base 20/@base;
			margin:10/@base 0;
			h1{
				font-size: 20/@base;
				font-weight: 400;
			}
			p{
				padding:10/@base 0;
				color:#999;
			}
			a{
				display: block;
				text-decoration: none;
				color:#003569;
				font-size: 20/@base;
				padding:20/@base 0;
			}
			&.nodata{
				text-align: center;
				color:#999;
				padding:10/@base 20/@base;
				margin:10/@base 0;
				a{
					text-decoration: none;
					color:#003569;
				}
			}
		}
	}
</style>